<template>

  <div class="balance">
    
    <div class="balance_tit">账户余额</div>
    <div class="balance_main">¥{{money}}</div>

    <button class="balance_btn">充值</button>
    <p class="balance_record" @click="toRechargeRecord">充值记录</p>

  </div>

</template>


<script>
export default {
  name: 'balance',
  data () {
    return {
      money: '200.00',
    }
  },
  mounted(){
    this.$root.share();
  },
  methods: {
    toRechargeRecord(){
      this.$router.push({path:'/rechargeRecord'})
    },
  }
}
</script>

<style scoped>
  .balance{

  }
  .balance_tit{
    padding-top: 3rem;
  }
  .balance_main{
    font-size: 2rem;
    padding: 3rem 0;
  }
  .balance_btn{
    width: 90%;
    height: 2.5rem;
    line-height: 2.5rem;
    background-color: #19C674;
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    margin: 1rem 0;
    font-size: 0.85rem;
  }
  .balance_record{
    font-size: 0.85rem;
    color: #888;
  }
</style>
<style>
  ul,li,div,a,p,span{
    margin: 0;
    padding: 0;
  }
  li{
    list-style: none;
  }
  .flex{
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
  }
</style>
